<template>
    <div class="stc">
        <div class="stc-title">
          <p>锁仓币</p>
          <p>0个</p>
        </div>
      <div class="stc-title">
        <p>释放币</p>
        <p>0个</p>
      </div>
      <div class="stc_con_tab_div">
        <p>释放记录</p>
        <div class="stc_con_tab_div_box">
          <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
            <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
              <div class="main-body">
                <ul>
                  <li v-for="(item,index) in intList.list" v-if="item.type==2">
                    <div class="stc_con_tab_div_box_left">
                      <p>{{item.content}}</p>
                      <p>ID：{{item.id}}</p>
                    </div>
                    <div  class="stc_con_tab_div_box_right">
                      <p>-{{item.integrate}}积分</p>
                      <p>{{item.created_at}}</p>
                    </div>
                  </li>
                  <li v-for="(item,index) in intList.list" v-if="item.type==1">
                    <div class="stc_con_tab_div_box_left">
                      <p>{{item.content}}</p>
                      <p>ID：{{item.id}}</p>
                    </div>
                    <div  class="stc_con_tab_div_box_right">
                      <p class="ji_p">-{{item.integrate}}积分</p>
                      <p>{{item.created_at}}</p>
                    </div>
                  </li>
                </ul>
              </div>
            </van-list>
          </van-pull-refresh>
        </div>
      </div>



    </div>
</template>

<script>
  export default {
    name: "STC",
    data(){
      return {
        userInfo:[],
        initDataList:[],
        initList:[],
        intPage:1,
        //下拉刷新
        isLoading: false,
        //上拉加载
        loading: false,
        finished: false,
        titleName:this.$route.query.titleName,
      }
    },
    created:function () {
      setTitle(this.titleName)
    },
    methods:{


      //下拉刷新
      onRefresh() {
        this.initDataList = [];
        this.pageNum = 1;
        this.finished = false;
        this.getCommodity();
      },
      //上拉加载
      onLoad() {
        if (this.intList.list && this.intList.list.length > 0) {
          this.getCommodity();
        }
      },
      //获取积分列表数据
      async getCommodity() {
        let params = {
          params: {
            user_id: this.userInfo.userId,
            pageNum: this.intPage,
            pageSize: 10
          }
        };
        const res = await this.$axios.get(this.$api.integrateRecord, params);
        if (res.success) {
          if (this.loading) {
            this.initDataList = this.initDataList.concat(res.data.list);
            this.intList = res.data;
            this.intList.list = this.initDataList;
            if (this.intList.list.length >= this.intList.total) {
              this.finished = true;
            } else {
              this.intPage++;
            }
          } else {
            this.intList = res.data;
            if (this.intList.list.length >= this.intList.total) {
              this.finished = true;
            }
          }
          this.isLoading = false;
          this.loading = false;
        } else {
          this.intList = {};
          this.$toast(res.msg);
        }
      },

    },
    mounted(){
      this.userInfo=JSON.parse(localStorage.getItem("userInfo"));
         this.getCommodity()
    }
  }
</script>

<style scoped>
  @import '../../assets/css/index.css';
  .stc{width: 100%;background-color: #fff;}
  .stc-title{line-height: 0.4rem;overflow: hidden;padding: 0 0.15rem;}
  .stc-title p{color: #000;font-size: 0.14rem;float:left;width: 50%;}
  .stc-title p:nth-child(2){text-align: right; color: #01bf47;}
  .stc_con_tab_div_box_left{
    float: left;
    width: 50%;
  }
  .stc_con_tab_div_box_left p:nth-child(1){
    font-size: 0.14rem;
    color: #808080;
  }
  .stc_con_tab_div_box_left p:nth-child(2){
    font-size: 0.11rem;
    color: #808080;
  }
  .stc_con_tab_div_box_right{
    float: right;
    width: 50%;
    text-align: right;
  }
  .stc_con_tab_div_box_right p:nth-child(1){
    font-size: 0.14rem;
    color: #34cc75;
    padding-right: 0.05rem;
  }
  .stc_con_tab_div_box_right p:nth-child(2){
    font-size: 0.11rem;
    color: #808080;
  }
</style>
